<template>
  <div class="home">
    <ColorfulText class="text">Welcome!</ColorfulText>
  </div>
</template>

<script setup lang="ts" name="home">
import ColorfulText from '@/components/common/Text/ColorfulText.vue'
</script>

<style scoped lang="scss">
.home {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border: 0.1em solid var(--el-border-color);
  background-color: var(--el-bg-color);
  .text {
    width: 90%;
    height: 100%;
    font-size: 12em;
    line-height: 500px;
    word-break: break-all;
  }
}
@media (max-width: 992px) {
  .home .text {
    line-height: 200px;
  }
} ;
</style>
